<template>
    <!-- 可以有多个根元素 -->
    <div>{{ obj }}</div>
    <button @click="add">点我年龄加1</button>
</template>
  
  <script>
  // 1.引进方法
  import { reactive } from 'vue';
  
  
  export default {
      setup() {
          // 调用方法，reactive会把传进来的对象转换成响应式
          let obj = reactive({
              name: 'zs',
              age: 20
          })
          console.log(obj)
  
          const add = () => {
              obj.age++
              console.log('obj.age', obj.age);
          }
  
          //   template需用使用数据，就return出去
          return {
              obj, add
          }
      },
  }
  </script>
  